<template>
  <div class="app-container">
    <avue-crud
      :data="data"
      :option="option"
      v-model="addObj"
      :page="page"
      @search-change="searchChange"
      @size-change="sizeChange"
      @current-change="currentChange"
      @row-save="submit"
      @row-update="edit"
      :before-close="beforeClose"
    >

      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          size="mini"
          icon="el-icon-delete"
          @click.native="delRow(scope)"
        >删除</el-button>
        <!--          <el-button-->
        <!--            type="text"-->
        <!--            size="mini"-->
        <!--            icon="el-icon-setting"-->
        <!--            @click.native="allocatePower(scope)"-->
        <!--          >分配权限</el-button>-->
      </template>

    </avue-crud>
  </div>
</template>

<script>
    import axios from 'axios'
    import {getList,addUser,deleteUser,updateUser,getDic} from '@/api/equipManagement'
    import {getListType,} from '@/api/equipmentTypeManagement'
    import {grade1,plcData,plcRealTime} from '@/api/operationMonitoring'
    export default {
        name: "roleManagement",
        watch:{
            data() {
                // 对 Table 进行重新布局
                this.$nextTick(()=>{
                    this.$refs.crud.$refs.table.doLayout()
                })
            },
        },
        data() {
            return {
                addObj: {
                    attachs: []
                },
                data: [],
                originPage:{
                    pageSize: 10,
                    currentPage: 1,
                    total: 10,
                },
                page: {
                    currentPage: 1,
                    pageSize: 10,
                    total: 10,
                    layout: "total,pager,prev, next",
                },

                option: {
                    labelPosition:"left",
                    labelWidth:120,
                    dialogEscape: false,
                    dialogClickModal: false,
                    dialogWidth: 1400,
                    height: "auto",
                    calcHeight: 100,
                    searchShow: true,
                    // excelBtn:true,
                    index: true,
                    indexLabel: "序号",
                    searchMenuSpan:4,
                    indexWidth: 100,
                    menuWidth: 300,
                    refreshBtn: false,
                    searchBtn: true,
                    columnBtn: false,
                    addBtn: true,
                    menu: true,
                    delBtn: false,
                    editBtn: true,
                    editBtnText: "修改",
                    align: "center",
                    addTitle: "录入新设备",
                    column: [
                        {
                            label: "设备编号",
                            prop: "deviceNumber",
                            search:true,
                            searchSpan: 4,
                            rules: [{
                                required: true,
                                message: "请输入设备编号",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: "设备名称",
                            prop: "deviceName",
                            search:true,
                        },
                        {
                            label: "经度",
                            prop: "longitude",
                        },
                        {
                            label: "纬度",
                            prop: "latitude",
                        },
                        {
                            label: "海拔(米)",
                            prop: "altitude",
                        },
                        {
                            label: "设备运行状态",
                            searchLabelWidth:120,

                            prop: "state",
                            type:"select",
                            dicData:[{
                                label:"正常运行",
                                value:0,
                            },{
                                label:"设备异常",
                                value:1,
                            },]
                        },
                        {
                            label: "设备表名",
                            prop: "tableName",
                        },
                        {
                            label: "上级设备",
                            prop: "parentId",
                            type:'select',
                            search:true,
                            dicData:[],
                            props: {
                                label: 'deviceName',
                                value: 'id'
                            },
                        },
                        {
                            label: "设备类型",
                            prop: "typeId",
                            type:'select',
                            dicData:[],
                            searchSpan: 4,
                            search:true,
                            props: {
                                label: 'typeName',
                                value: 'id'
                            },
                            rules: [{
                                required: true,
                                message: "请输入设备类型",
                                trigger: "blur"
                            }]
                        },
                        {
                            label: '弹窗显示信息',
                            prop: 'plcData',
                            type: 'dynamic',
                            span: 24,
                            children: {
                                align: 'center',
                                headerAlign: 'center',
                                column: [
                                    {
                                    label: '字段名',
                                    prop: "name",
                                },
                                    {
                                        label: '计算方式',
                                        prop: "type",
                                        type:"select",
                                        dicData:[{
                                            label:"直接显示",
                                            value:'1',
                                        },{
                                            label:"求和",
                                            value:'2',
                                        },{
                                            label:"减去当日零点",
                                            value:'3',
                                        },{
                                            label:"求和后减掉当日零点",
                                            value:'4',
                                        },],
                                    },
                                    {
                                        label: '数据库字段名1',
                                        prop: "dataBaseName1",
                                    },
                                    {
                                        label: '数据库字段名2',
                                        prop: "dataBaseName2",
                                    },
                                    {
                                        label: '数据库字段名3',
                                        prop: "dataBaseName3",
                                    },
                                    {
                                        label: '数据库字段名4',
                                        prop: "dataBaseName4",
                                    },
                                    {
                                        label: '数据库字段名5',
                                        prop: "dataBaseName5",
                                    },
                                ]
                            }
                        },
                    ]
                },

            };
        },
        computed: {

        },
        methods: {

            initData() {
                this.page.pageNum=this.page.currentPage
                getList(this.page).then(res=>{
                    this.data = res.data.resultList;
                    this.page.total = res.data.total;
                })
            },

            initDic() {
                // getDic().then(res=>{
                //     console.log(res,'dic')
                //     let index1 = this.findObject(this.option.column, "plcData");
                //     console.log(index1.children.column)
                //     for(let i=2;i<=6;i++){
                //         index1.children.column[i].dicData = res.data;
                //     }
                //     // index1.children.column[2].dicData = res.data;
                //     // index1.dicData = res.data.data;
                // })
                let page={
                    pageNum: 1,
                    pageSize: 1000,
                }
                getListType(page).then(res=>{
                    let index1 = this.findObject(this.option.column, "typeId");
                  index1.dicData = res.data.resultList;
                })
                grade1().then(res=>{
                  let temp={deviceName:'空',id:0}
                  // res.data.push(temp)
                  let index1 = this.findObject(this.option.column, "parentId");
                    index1.dicData = res.data;
                  index1.dicData.unshift(temp);
                })
            },

            searchChange(params, done) {
                this.page=this.originPage
                this.query=params
                this.page={...this.page,...params}
                console.log(this.page)
                this.initData();
                done()
            },

            sizeChange(val) {
                this.page.currentPage = 1;
                this.page.pageSize = val;
                this.initData();
            },

            currentChange(val) {
                this.page.currentPage = val;
                this.initData();
            },

            handleAdd() {
                this.$refs.crud.rowAdd();
            },
            submit(form, done) {
                console.log("addform");
                console.log(form);
                console.log(form.plcData);
                let detailPlcData=[]
                for(let i=0;i<form.plcData.length;i++){
                    let item=[]
                    item.push(form.plcData[i].name)
                    item.push(form.plcData[i].type)
                    item.push(form.plcData[i].dataBaseName1)
                    item.push(form.plcData[i].dataBaseName2)
                    item.push(form.plcData[i].dataBaseName3)
                    item.push(form.plcData[i].dataBaseName4)
                    item.push(form.plcData[i].dataBaseName5)
                    let notNullItem=item.filter((string)=>{return string!=""})
                    detailPlcData.push(notNullItem)
                }
                console.log(detailPlcData)
                form.detailPlcData=detailPlcData
                addUser(form).then(res=>{
                    console.log(res);
                    this.$message.success("新增设备成功")
                    this.initData();
                })
                done();
            },


            edit(row, index, done, loading) {
                console.log("editform");
                console.log(row);
                let detailPlcData=[]
                for(let i=0;i<row.plcData.length;i++){
                    let item=[]
                    item.push(row.plcData[i].name)
                    item.push(row.plcData[i].type)
                    item.push(row.plcData[i].dataBaseName1)
                    item.push(row.plcData[i].dataBaseName2)
                    item.push(row.plcData[i].dataBaseName3)
                    item.push(row.plcData[i].dataBaseName4)
                    item.push(row.plcData[i].dataBaseName5)
                    let notNullItem=item.filter((string)=>{return string!=""})
                    detailPlcData.push(notNullItem)
                }
                console.log(detailPlcData)
                row.detailPlcData=detailPlcData
                updateUser(row).then(res=>{
                    console.log(res);
                    this.$message.success("修改设备信息成功")
                    this.initData();
                })
                done()
            },

            change(data) {
                this.$refs.crud.rowEdit(res.data.data);
            },
            delRow(scope){
                this.$confirm('此操作将永久删除该设备信息, 是否继续?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    deleteUser(scope.row.id).then(res=>{
                        this.initData();
                        this.$message({
                            type: 'success',
                            message: '删除成功!'
                        });
                    })
                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消删除'
                    });
                });
            },
            resetPassword(row){
                console.log(row)
            },


            beforeClose(done) {
                done()
            },

        },
        mounted() {
            this.initData()
             this.initDic()

        },


        created() {

        },

    };
</script>

<style lang="scss">

</style>
